//加载公共样式
require('../../assets/css/index.less')
require('../../assets/js/property.js')
require('../../assets/font/font_3852666_7r0dooui378/iconfont.css')
//加载自己的样式
require('./play.less')
const request = require('../../assets/js/requers')
window.onload = () => {
    //服务器地址
    const API = 'http://fitness.h5.itsource.cn:3701'
  
    //获取本地数据
    const fragments = JSON.parse(localStorage.getItem('fragments'))
  
    //设置变量
    let index = 0 //初始化播放的索引
    let length = fragments.length //视频总个数
    let timeList = [] //用于保存所有运动的时间
  let time = 0 //记录当前时间
    //播放函数
    function play() {
      //给视频src赋值
      $('#player').src = API + fragments[index].videoUrl
   //信息赋值
   $('#curIndex').textContent = index + 1
   $('#totalLength').textContent = length
   $('#title').textContent = fragments[index].title
      //监听播放器能播放时候 再播放
      $('.player').addEventListener('canplay', () => {
        //播放
        $('.player').play()
       
      })
    }
  
    //初始化播放
    play()
    //下一曲
  
  _next=() => {
    //能够播放下一条
    if (index < length - 1) {
      //索引+1
      index++
      //播放器播放下一个视频
      play()
         //把上次记录的时间 存进数组
         timeList.push(time)
    } else {
      index = 0
      play()
    }
  }
  $('#next').addEventListener('click',_next )
  //上一曲
  $('#pre').addEventListener('click', () => {
    if (index > 0) {
      //索引-1
      index--
      //播放器播放上一个视频
      //console.log('index :>> ', index)
      play()
       //把上次记录的时间 存进数组
       timeList.push(time)
    } else {
        index = 0
        play()
    }
  })

  //暂停
  $('#pause').addEventListener('click', () => {
    //显示播放按钮 隐藏暂停按钮
    $('#playBtn').style.display = 'block'
    $('#pause').style.display = 'none'
    //弹窗弹出
    $('.popup').style.display = 'block'
    //暂停
    $('#player').pause()
  })

  //播放
  $('#playBtn').addEventListener('click', () => {
    //显示暂停按钮 隐藏播放按钮
    $('#playBtn').style.display = 'none'
    $('#pause').style.display = 'block'
    //播放
    $('#player').play()
  })
  _theProgress()
  /**
 * 进度条
 */
  $('#player').addEventListener('timeupdate', _theProgress) //播放进度条
  $('#player').addEventListener('ended', _next) //播放结束自动切换到下一曲
function _theProgress() {

    //当前时间/总时间 = 当前进度条宽度/总进度条宽度
    //当前进度条宽度= 当前时间/总时间 * 总进度条宽度

    //$('.progress').style.width = video.currentTime / video.duration * $('.controls').clientWidth + 'px'
    //console.log();

    $('.progress').style.width = ($('#player').currentTime / $('#player').duration) * 100 + '%'
     //把当前时间记录在time里面
     time = $('#player').currentTime
}

  //监听播放结束
  $('#player').addEventListener('ended', () => {
    //执行下一曲
    $('#next') .click()
  })

  //点击继续
  $('#continue1').addEventListener('click', () => {
    //弹窗隐藏
    $('.popup').style.display = 'none'
    //继续播放
    $('#playBtn').click()
  })

  //结束训练
  $('#end') .addEventListener('click', () => {
    //把运动数据发送请求 保存到数据库
    timeList.push($('#player').currentTime)
    //1 循环求和
    // let total = 0 //创建一个变量
    // //循环求和
    // timeList.forEach(v => {
    //   total += v
    // })

    //计算总时长
    let res = timeList.reduce((total, cur) => {
      return total + cur
    }, 0)

    //发送请求
    request
      .post('/api/exercise/save', {
        type: 2,
        duration: res,
        calorie: res * 1000,
      })
      .then(res => {
        if (res.data.errno === 0) {
          //跳转到课程页面
          console.log(res.data);
          //location.href = './course.html'
        }
      })
  })


  }
